import React, { Component } from "react";
import hamburger from "../assets/hamburger.jpg";
import styles from "./styles.module.less";
import 加 from "../assets/餐饮版首页切图/加.png";
import 减 from "../assets/餐饮版首页切图/减.png";

export default class Comm extends Component {
    state = {
        count: 0
    };

    render() {
        const { count } = this.state;
        return (
            <div className={styles.comm}>
                <div className={styles.commHead}>
                    <img src={hamburger} alt='' />
                </div>
                <div className={styles.commMsg}>
                    <div className={styles.msgTitle} >双层麻辣鸡腿堡双层麻辣...</div>
                    <div className={styles.msgRemind} >
                        <div>每单仅限一份</div>
                        <div>仅剩8份</div>
                    </div>
                    <div className={styles.piceAcount}>
                        <div className={styles.price}>
                            <div>¥</div>
                            25
                            <s>¥50</s>
                        </div>
                        <div className={styles.count} >
                            <div
                                onClick={() => {
                                    if (count > 0) {
                                        this.setState({ count: count - 1 });
                                    }
                                }}
                            >
                                <img src={减} alt='' />
                            </div>
                            <div>{count}</div>
                            <div
                                onClick={() => {
                                    this.setState({ count: count + 1 });
                                }}
                            >
                                <img src={加} alt='' />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}
